﻿@{
    ViewBag.Title = "教师管理";
    Layout = "~/Views/Shared/_GridCommonLayout.cshtml";
}



<!--begin grid code-->


<section id="widget-grid" class="">
    <div class="row">

        <!--Operation-->
        <div class="heading-buttons">


            <div class="col-xs-12 col-sm-7 col-md-7 col-lg-4">
                <h1 class="page-title txt-color-blueDark"><i class="fa fa-user "></i>
                    教职工管理
			
                </h1>
            </div>
            <div class="buttons pull-right">

                <button type="button" class="btn btn-success btn-labeled "
                    data-bind="click: $root.showAddBefore">
                    <span class="btn-label"><i class="glyphicon glyphicon-plus"></i>
                    </span>添加记录</button>

                <button type="button" class="btn btn-primary btn-labeled "
                    data-bind="click: $root.onDataDeleting">
                    <span class="btn-label"><i class="glyphicon glyphicon-remove"></i>
                    </span>批量删除</button>


            </div>
            <div style="clear: both;">
            </div>
        </div>
        <!--/Operation-->




        <!--Search-->
        <div class="filter-bar">
            <form id="formSearch">
                <div class="lbl glyphicons search" style="cursor: pointer;" data-bind="click: $root.search">
                    <i></i>筛选
                </div>


                <div>
                    <label>教师编号：</label><div class='input-append'>
                        <input id='txtbSrSTeaNo' name='txtbSrSTeaNo' type='text' placeholder='教师编号' class='input-mini' style='width: 120px;' />
                    </div>
                </div>
                <div>
                    <label>教师姓名：</label><div class='input-append'>
                        <input id='txtbSrSTeaName' name='txtbSrSTeaName' type='text' placeholder='教师姓名' class='input-mini' style='width: 120px;' />
                    </div>
                </div>

                <div>
                    <label>学院名称：</label><div class='input-append'>
                        <input id='txtbSrSColleName' name='txtbSrSColleName' type='text' placeholder='' class='input-mini' style='width: 120px;' />
                    </div>
                </div>
                <div>
                    <label>职称：</label><div class='input-append'>
                        <input id='txtbSrSProfessor' name='txtbSrSProfessor' type='text' placeholder='职称' class='input-mini' style='width: 120px;' />
                    </div>
                </div>

                <div class="clearfix">
                </div>
            </form>
        </div>
        <!--/search-->



        <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
            <div id="wid-id-0" class="jarviswidget jarviswidget-color-darken jarviswidget-sortable" data-widget-editbutton="false">
                <header>
                    <span class="widget-icon"><i class="fa fa-table"></i></span>
                    <h2>教师信息</h2>
                </header>
                <div style="margin-top: 35px;">
                    <div class="jarviswidget-editbox"></div>
                    <div class="widget-body no-padding">
                        <div role="grid" id="providerGrid" class="dataTables_wrapper form-inline">
                            <div class="table-responsive">

                                <div class="dt-wrapper" style="overflow-y: auto;">
                                    <table class="table table-striped table-bordered table-hover checkboxs">
                                        <!--table head-->
                                        <thead>
                                            <tr>
                                                <th style="width: 1%">
                                                    <input type="checkbox" value="0" />
                                                </th>
                                                <!-- ko foreach: headers -->
                                                <th class="center ">
                                                    <a href="#" data-bind="text: displayText@*, click: $root.sort*@" style="color: black"></a>
                                                    <i class="icon-circle-arrow-up" data-bind="    visible: value == $root.orderBy() && $root.isAsc()"></i>
                                                    <i class="icon-circle-arrow-down" data-bind="    visible: value == $root.orderBy() && !$root.isAsc()"></i>
                                                </th>
                                                <!-- /ko -->
                                                <th class="center" style="width: 60px">操作
                                                </th>
                                            </tr>
                                        </thead>
                                        <!--/table head-->
                                        <!--table body(Provider list)-->
                                        <tbody data-bind="foreach: recordSet">
                                            <tr class="selectable" onclick="">
                                                <td class="center">
                                                    <input type="checkbox" name="userSelector" data-bind="value: Id" />
                                                    <input type="hidden" data-bind="value: Id, attr: { id: Id }" />
                                                </td>

                                                <td class='center'><strong data-bind='text: Id'></strong></td>
                                                <td class='center'><strong data-bind='text: STeaNo'></strong></td>
                                                <td class='center'><strong data-bind='text: STeaName'></strong></td>
                                                <td class='center'><strong data-bind='text: SProfessor'></strong></td>
                                                <td class='center'><strong data-bind='text: sexChange(ISex)'></strong></td>
                                                <td class='center'><strong data-bind='text: SIdCard'></strong></td>
                                                <td class='center'><strong data-bind='text: SColleName'></strong></td>
                                                <td class='center'><strong data-bind='text:date(DLastDate)'></strong></td>
                                                <td class='center'><strong data-bind='text: SEmail'></strong></td>
                                                <td class='center'><strong data-bind='text: SPhone'></strong></td>

                                                <td class="center">
                                                    <a href="#" class="btn-action glyphicons pencil btn-success" data-bind="click: $root.showUpdateModal">
                                                        <i></i></a>
                                                </td>
                                            </tr>
                                        </tbody>
                                        <!--/table body( Provider list)-->

                                    </table>

                                </div>



                                <!-- 分页 -->
                                <ul class="pagination pagination-alt">
                                    <li>
                                        <a data-bind="click: firstPage"><i class="fa fa-fast-backward "></i></a>
                                    </li>
                                    <li>
                                        <a data-bind="click: prevPage"><i class="fa  fa-backward  "></i></a>
                                    </li>
                                    <li>
                                        <a>
                                            <input id="toPage" type="text" data-bind="value: pageIndex, event: { change: $root.changePageIndex }" style="width: 25px;" />
                                            /共<span data-bind="html: totalPages"></span>页 
                                        </a>
                                    </li>
                                    <li>
                                        <a data-bind="click: nextPage"><i class="fa fa-forward "></i></a>
                                    </li>
                                    <li>
                                        <a data-bind="click: lastPage"><i class="fa fa-fast-forward "></i></a>
                                    </li>
                                </ul>

                                <div class="dt-top-row total  ">
                                    当前记录共：<span data-bind="html: totalCount"></span>条
                                </div>
                                <!--end 分页-->
                            </div>

                            <!-- /分页 -->


                        </div>

                        <!-- /分页 -->

                    </div>
                </div>

            </div>




        </article>

    </div>
    <!--end row-->
</section>


<!--Teachers详细对话框-->
<div id="TeachersMessageModal" class="modal fade" id="ProviderMessageModal" tabindex="-1" role="dialog"
    aria-labelledby="TeachersMessageModalLabel" aria-hidden="true" style="width: 800px;">
    <div class="modal-content">
        <div class="modal-header">
            <h3>教师详细信息<button type="button" class="close" data-dismiss="modal" aria-hidden="true" id="btnClose">×</button></h3>
        </div>

        <div class="modal-header">

            <ul class="nav nav-tabs bordered" id="myTab1">
                <li class="active"><a data-toggle="tab" href="#s1">详细信息</a></li>
                <li><a data-toggle="tab" href="#s2">设置密码</a></li>
                <li><a data-toggle="tab" href="#s3">个人介绍</a></li>
            </ul>
            <div class="tab-content padding-10" id="myTabContent1">
                <!--详细信息-->
                <div class="tab-pane fade in active" id="s1">
                    <div class="modal-body">
                        <input type='hidden' id='txtbID' name='txtbID' />
                        <form class="smart-form" id="formTeachers" data-bind="with: NodeValue">

                            <div class="row">
                                <section class="col col-6">
                                    <label class='label'>教师编号:<span style='color: Red;font-size:20px;'>*</span></label>
                                    <label class="input">
                                        <input type='text' id='txtbSTeaNo' name='txtbSTeaNo' placeholder='' class='span10' data-bind='value:STeaNo' />                                        
                                    </label>
                                </section>
                                <section class="col col-6">
                                    <label class='label'>教师姓名:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSTeaName' name='txtbSTeaName' placeholder='' class='span10' data-bind='value:STeaName' />
                                    </label>
                                </section>
                            </div>
                            <div class="row">
                                <section class="col col-6">
                                    <label class="label">性别</label>
                                    <label class="select">
                                        @{
                                            List<SelectListItem> SexList = new List<SelectListItem>();
                                            SexList.Add(new SelectListItem { Text = "不详", Value = "0"});
                                            SexList.Add(new SelectListItem{Text = "女",Value = "1"}); 
                                            SexList.Add(new SelectListItem{Text = "男",Value = "2"});  
                                            }
                                        @Html.DropDownList("txtbISex", SexList as IEnumerable<SelectListItem>, "--请选择--",new { @data_bind = "value:ISex"})
                                    </label>
                                </section>
                                <section class="col col-6">
                                    <label class='label'>身份证号:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSIdCard' name='txtbSIdCard' placeholder='' class='span10' data-bind='value:SIdCard' />
                                    </label>
                                </section>
                            </div>
                            <div class="row">
                                <section class="col col-6">
                                    <label class='label'>出生日期:</label>
                                    <label class="input">
                                        <input type='text' id='txtbDBirthDay' name='txtbDBirthDay' placeholder='yyyy/mm/dd' class='span10' data-bind='value:DBirthDay' />
                                    </label>
                                </section>
                                <section class="col col-6">
                                    <label class="label">学院:</label>
                                    <label class="select">
                                        @Html.DropDownList("txtbSCollegeCode", new SelectList(@ViewBag.partList, "SCollegeCode", "SCollegeName"), "--请选择--", new { @data_bind="value:SColleCode"})
                                    </label>
                                </section>
                            </div>
                            <div class="row">
                                <section class="col col-6">
                                    <label class='label'>职称:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSProfessor' name='txtbSProfessor' placeholder='' class='span10' data-bind='value:SProfessor' />
                                    </label>
                                </section>
                                <section class="col col-6">
                                    <label class='label'>电子邮箱:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSEmail' name='txtbSEmail' placeholder='' class='span10' data-bind='value:SEmail' />
                                    </label>
                                </section>
                            </div>
                            <div class="row">
                                <section class="col col-6">
                                    <label class='label'>联系电话:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSPhone' name='txtbSPhone' placeholder='' class='span10' data-bind='value:SPhone' />
                                    </label>
                                </section>
                                <section class="col col-6">
                                    <label class='label'>QQ:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSQq' name='txtbSQq' placeholder='' class='span10' data-bind='value:SQq' />
                                    </label>
                                </section>
                            </div>
                            <div class="row">
                                <section class="col col-6">
                                    <label class='label'>个人网站:</label>
                                    <label class="input">
                                        <input type='text' id='txtbSWebUrl' name='txtbSWebUrl' placeholder='' class='span10' data-bind='value:SWebUrl' />
                                    </label>
                                </section>
                            </div>
                        </form>
                    </div>
                </div>

                <!--设置密码-->
                <div class="tab-pane fade in " id="s2">
                    <form class="smart-form" data-bind="with:NodeValue">
                        <fieldset>
                            <section>
                                <label class='control-label'>密码<span style="color: red;">*(长度为6-20)</span></label>
                                <label class="input">
                                    <input type="password" id='txtbSPassWord' name='txtbSPassWord' placeholder='' class='span10' data-bind='value:SPassWord' />
                                </label>
                            </section>

                            <section>
                                <label class='control-label'>确认密码<span style="color: red;">*</span></label>
                                <label class="input">
                                    <input type="password" id='confirm_password' name='confirm_password' placeholder='' class='span10' data-bind='value:SPassWord' />
                                </label>
                            </section>
                        </fieldset>
                    </form>
                </div>

                <!--个人介绍-->
                <div class="tab-pane fade in " id="s3">
                    <div class="click2edit" style="height: 400px;"></div>
                </div>

                <div class="modal-footer">
                    <button class="btn" data-dismiss="modal" aria-hidden="true" id="btnCancel">
                        取消</button>
                    <button id="btnSaveOrUpdateModel" class="btn btn-primary" aria-hidden="true" data-bind=" click: onDataAddingOrUpdate">
                        确定</button>
                </div>
            </div>
            <!--end div content-->
        </div>
    </div>
</div>
<!--/详细Teachers对话框-->



<script src="~/Js/plugin/summernote/summernote.js"></script>
<script src="~/Scripts/md5/jQuery.md5.js"></script>
<script type="text/javascript">

    //规范时间显示格式
    function date(date) {
        if (date == null || date == "") {
            return "";
        }
        var dd = date.slice(0, 10);
        var ss = date.slice(11, 19);
        return dd + " " + ss;
    }

    //初始化编辑器
    var edit = function () {
        $('.click2edit').summernote({ focus: true });
    };

    //性别的转换
    var sexChange = function (Isex) {
        if (Isex == 0)
            return "";
        else if (Isex == 1)
            return "女";
        else
            return "男";
    }

    //验证密码
    var VerifyPassword = function () {
        var p1 = $("#txtbSPassWord").val();
        var p2 = $("#confirm_password").val();
        if (p1 == "" || p2 == "") {
            alert("请填写密码");
            return false;
        }
       else if (p1.length < 6 || p1.length > 20) {
            alert("密码长度为6—20位");
            return false;
        }
       else if (p1 != p2) {
           alert("两次密码输入不一致");
           $("#txtbSPassWord").val("");
           $("#confirm_password").val("");
           return false;
       }
       else {
           return true;
       }              
    }

    var gdViewModel;
    $(function () {

        edit();

        $(".note-editable").css("height", "310px");



        $._messengerDefaults = {
            extraClasses: 'messenger-fixed messenger-theme-future messenger-on-bottom messenger-on-right'
        }; //默认提示位置;


        var options = {

            dialogId: "TeachersMessageModal", //添加对话框

            pageSize: 20, //分页大小
            hidId: $("#txtbID"),
            SaveUpdateBtn: $("#btnSaveOrUpdateModel"),
            frmElement: $("#formTeachers"),

            //节点数据
            NodeValue: ko.observable({

                Id: 0,
                STeaNo: '',
                STeaName: '',
                ISex: 0,
                SIdCard: '',
                DBirthDay: '',
                SColleCode: '',
                SColleName: '',
                SProfessor: '',
                SPassWord: '',
                SPicUrl: '',
                SIntro: '',
                IState: 0,
                DLastDate: new Date(),
                DLastIp: '',
                SEmail: '',
                SPhone: '',
                SQq: '',
                SWebUrl: '',


            }),


            //用户列表Grid头部列名称
            headers: [


 { displayText: 'ID', value: 'Id', width: 'auto' },
 { displayText: '教师编号', value: 'STeaNo', width: 'auto' },
 { displayText: '教师姓名', value: 'STeaName', width: 'auto' },
 { displayText: '职称', value: 'SProfessor', width: 'auto' },
 { displayText: '性别', value: 'ISex', width: 'auto' },
 { displayText: '身份证号', value: 'SIdCard', width: 'auto' },
 { displayText: '学院名称', value: 'SColleName', width: 'auto' },
 { displayText: '最后登录时间', value: 'DLastDate', width: 'auto' },
 { displayText: '电子邮箱', value: 'SEmail', width: 'auto' },
 { displayText: '电话', value: 'SPhone', width: 'auto' },

            ],

            //默认的排序方式
            defaultOrderBy: "Id",
            //用户查询URL
            dataQueryUrlAccessor: function () {
                return "/api/Teachers/GetByPage";
            },

            //添加用户URL
            dataAddUrlAccessor: function () { return "/api/TeacherManger/PostTea"; },
            dataUpdateAccessor: function (key) {

                password = $("#txtbSPassWord").val();
                if ( password != "") {
                    //验证密码
                    if (!VerifyPassword()) {
                        return "";//验证失败
                    }
                    
                }
                options.NodeValue().SPassWord = $("#txtbSPassWord").val();

                //取得学院名称
                var Name = $("#txtbSCollegeCode").find("option:selected").text();
                var SColleName = Name.split("_", 2);
                options.NodeValue().SColleName = SColleName[1];

                options.NodeValue().SIntro = $(".note-editable").code();               

                return "/api/TeacherManger/PutTea/" + key;
            },
            dataNodeSelect: function (id) {
                return "/api/TeacherManger/GetTea/" + id;
            },

            dataDeleteAccessor: function (data) {
                var userIDs = "";
                var check = $("input:checked");  //得到所有被选中的checkbox
                check.each(function (i) {        //循环拼装被选中项的值
                    userIDs = userIDs + ',' + $(this).val();
                });
                //清除多余的分割号
                userIDs = dropRsplit(userIDs, ",");
                if (userIDs != "") {
                    return appendQueryString("/api/Teachers/DeleteIds", { ids: userIDs });
                } else
                    return "";

            }
            , AddBefore: function () {
                //表单发送前的函数
                
                //验证密码
                var p1 = $("#txtbSPassWord").val();
                var p2 = $("#confirm_password").val();
                if (p1 == "" || p2 == "") {
                    alert("请填写密码");
                    return;
                }
                if (p1.length < 6 || p1.length > 20) {
                    alert("密码长度为6—20位");
                    return;
                }
                if (p1 != p2) {
                    alert("两次密码输入不一致");
                    $("#txtbSPassWord").val("");
                    $("#confirm_password").val("");
                    return;
                }

                //取得学院名
                var Name = $("#txtbSCollegeCode").find("option:selected").text();
                var SColleName = Name.split("_", 2);
                options.NodeValue().SColleName = SColleName[1];

                options.NodeValue().SPassWord = $("#txtbSPassWord").val();
                options.NodeValue().SIntro = $(".note-editable").code();
                return true;
            }
            , initEd: function () {
                //gird初始化的后置事件 信息

            }
            , showDlgBefore: function () {
            }
            , changeEnd: function () {
                //对话框关闭后 的后置事件
                $("#txtbSPassWord").val("");
                $("#confirm_password").val("");
                $(".note-editable").text("");
            }
            , showDetailEnd: function (data) {
                $(".note-editable").prepend(data.SIntro);
                //显示对话框详细之后
            }

        };

        gdViewModel = new gridViewModel(options);


        gdViewModel.init();
        ko.applyBindings(gdViewModel);


        options.frmElement.validate({
            rules: {

                txtbId: { required: true, digits: true },
                txtbSTeaNo: { required: true, maxlength: 10 },
                txtbSTeaName: { maxlength: 50 },
                txtbISex: { digits: true },
                txtbSIdCard: { maxlength: 50 },
                txtbDBirthDay: { date: true },
                txtbSColleCode: { maxlength: 50 },
                txtbSColleName: { maxlength: 50 },
                txtbSProfessor: { maxlength: 50 },
                
                txtbSPicUrl: { maxlength: 50 },
                txtbSIntro: { maxlength: 50 },
                txtbIState: { digits: true },
                txtbDLastDate: { date: true },
                txtbDLastIp: { date: true },
                txtbSEmail: { email: true },
                txtbSPhone: { isPhone: true },
                txtbSQq: { qq:true },
                txtbSWebUrl: { url: true }

            },
            messages: {

                txtbId: { required: '必填项', digits: '必须是整数' },
                txtbSTeaNo: { required: '必填项', maxlength: '最大长度为10' },
                txtbSTeaName: { maxlength: '最大长度为25' },
                txtbISex: { digits: '必须是整数' },
                txtbSIdCard: { maxlength: '最大长度为25' },
                txtbDBirthDay: { date: '必须是日期格式，例如：2013/01/01' },
                txtbSColleCode: { maxlength: '最大长度为10' },
                txtbSColleName: { maxlength: '最大长度为25' },
                txtbSProfessor: { maxlength: '最大长度为10' },
                txtbSPicUrl: { maxlength: '最大长度为100' },
                txtbSIntro: { maxlength: '最大长度为0' },
                txtbIState: { digits: '必须是整数' },
                txtbDLastDate: { date: '必须是日期格式，例如：2013/01/01' },
                txtbDLastIp: { date: '必须是日期格式，例如：2013/01/01' },
                txtbSEmail: { email: '请输入正确的邮箱地址' },
                txtbSPhone: { },
                txtbSQq: { qq:'请输入正确的QQ号' },
                txtbSWebUrl: { url: '请输入正确的网址' }

            }
        });

        //验证教职工号唯一
        $("#txtbSTeaNo").blur(function () {
            $.getJSON("/api/AddVaildate/TeacherNoValidate?TeaNO=" + $("#txtbSTeaNo").val(), function (data) {
                if (data != "") {
                    alert("该教职工编号已存在")
                    $("#txtbSTeaNo").val("");
                }
            })
        });

        //点击“取消”按钮清空已填内容
        $("#btnCancel").click(function () {
            $("#txtbSPassWord").val("");
            $("#confirm_password").val("");
            $(".note-editable").text("");
        });

        //点击“关闭”按钮清空已填内容
        $("#btnClose").click(function () {
            $("#txtbSPassWord").val("");
            $("#confirm_password").val("");
            $(".note-editable").text("");
        });

    });

</script>

<!--/end grid code-->
